<div class="modal-header">
  <h3 class="modal-title">用户设置</h3>
</div>
<div class="modal-body user-detail">
  <form name="userForm" novalidate="novalidate">
    <div class="row">
      <p>用户名</p>
      <input type="text" name="user_name" ng-model="vm.user.username" style="width:94.5%;" maxlength="30" required ng-pattern="/^[a-zA-Z0-9]([a-zA-Z0-9\-]*[a-zA-Z0-9])?$/">
      <div ng-if="userForm.user_name.$invalid" ng-messages="userForm.user_name.$error">
        <label class="error-messages" ng-message="required"><i></i>不能为空</label>
        <label class="error-messages" ng-message="pattern"><i></i>由数字、字母、中横线组成，不能以中横线开头结尾</label>
      </div>
    </div>
    <div class="row">
      <p>用户类型</p>
      <select ng-model="vm.user.usertype" name="usertype" required>
          <option ng-repeat="type in vm.userTypeData track by $index" value="{{type.type_id}}">{{type.type_name}}</option>
      </select>
      <div ng-if="userForm.usertype.$invalid" ng-messages="userForm.usertype.$error">
          <label class="error-messages" ng-message="required"><i></i>不能为空</label>
      </div>
    </div>
    <div class="row">
      <p>密码</p>
      <input type="password" name="password" ng-model="vm.user.password" maxlength="30" ng-minlength="8" required validator-password style="width:94.5%;"/>
      <div ng-if="userForm.password.$invalid" ng-messages="userForm.password.$error">
        <label class="error-messages" ng-message="required"><i></i>不能为空</label>
        <label class="error-messages" ng-message="minlength"><i></i>最小8位字符</label>
        <label class="error-messages" ng-message="password"><i></i>由数字和字母组成，必须同时包含大小写字母，最多30位</label>
      </div>
    </div>
    <div class="row">
      <p>确认密码</p>
      <input type="password" name="confirm_password" ng-model="vm.user.confirm_password" required style="width:94.5%;" validator-match="{{vm.user.password}}" />
      <div ng-if="userForm.confirm_password.$invalid" ng-messages="userForm.confirm_password.$error">
        <label class="error-messages" ng-message="required"><i></i>不能为空</label>
        <label class="error-messages" ng-message="match"><i></i>两次密码不匹配</label>
      </div>
    </div>
  </form>
</div>
<div class="modal-footer" style="clear: both">
  <button class="btn btn-default-dark"  ng-click="vm.ok()" ng-disabled="userForm.$invalid">确认</button>
  <a class="btn btn-default-dark" ng-click="vm.cancel()">取消</a>
</div>